import React from 'react';
import TodoItem from './todo-item';

class TodoList extends React.Component {

      render() {
        // 获取从父组件传递过来的 todolist
          const todoList = this.props.todoList;

        // 循环生成每一条 todoItem，并将 delete 方法传递给子组件
          const todoItems = todoList.map((item,index) => {
              return (
                <TodoItem
                      key={index}
                      id = {item._id}
                      content={item.content}
                      date={item.date}
                      done={item.done}
                      onCheckItem={this.props.onCheckItem}
                      onDeleteItem={this.props.onDeleteItem}
                />
            )
        });

        return (
            <div className="todoItemWrap">
                { todoItems }
            </div>
        )
      }
}

export default TodoList;